<template>
  <div class="not-found">
      <h1>404 - 页面未找到</h1>
      <el-empty description="您访问的页面不存在。">
        <el-space :size="30">
          <el-button link type="info" plain @click="onBack"> 返回</el-button>
          <el-button link type="primary" @click="onToHome"> 主页</el-button>
        </el-space>
      </el-empty>
    </div>
</template>

<script setup>
import router from "../../router";

const onBack = () => {
  router.back();
};
const onToHome = () => {
  router.replace("/");
};
</script>

<style scoped>
.not-found {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh; /* 使容器高度为视口高度 */
  text-align: center; /* 文本水平居中 */
}
</style>